<template>
  <div class='list bc-white'>
    <ul>
      <li v-for="(item,index) in formatListData" class="active pr" :key="index" @click="showDetail(item)">
        <p class="title">{{item.title}}</p>
        <p><span>投票发起人：{{item.name}}</span></p>
        <p><span>投票时间：{{item.time}}</span></p>
        <img class="arrow-right" :src="arrow_right" alt="">
      </li>
    </ul>
    <p class="no-data" v-if="formatListData.length===0">暂时没有数据哦~</p>
  </div>
</template>
<script>
export default {
  props:['listData','routerDetail'],
  components: {},
  name: "",
  data() {
    return {
      arrow_right:require("../../../../../assets/images/home/arrow-right-green.png"),
    };
  },
  computed:{
    formatListData(){
      return this.listData||[]
    }
  },
  methods: {
    showDetail(item){
      if(this.routerDetail)this.routerDetail(item)
    }
  },
  created() {}
};
</script>
<style lang="scss" scoped>
.list {
  li{
    padding: 20px 30px;
    border-bottom: 1px solid #e4e4e4;
    box-sizing: border-box;

    p{
      font-size: 12px;
      margin-top: 5px;
      color: #666;
    }
    p.title{
      font-size: 16px;
      color:#333;
      line-height: 50px;
      height: 50px;
    }
    .arrow-right{
      width: 20px;
      height: 40px;
      position: absolute;
      top: 50%;
      right: 10px;
      transform: translateY(-50%);
    }
  }
}
</style>